<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body>
    <script>
      //1 。定义一个对象

      // let obj = Object.defineProperty({},"name",{
      //     configurable:true,
      //     enumerable:true,
      //     get(){
      //         return "张三";
      //     },
      //     set(newValue) {
      //         console.log(newValue)
      //     }
      // })
      // console.log(obj);

      // 2.修改一个普通的对象

      // console.log(obj);
      // Object.defineProperty(obj,"name",{
      //     configurable:true,
      //     enumerable:true,
      //     get(){
      //         console.log("get");
      //         return "张三";
      //     },
      //     set(newValue){
      //         console.log(newValue);
      //     }
      // })

      // Object.defineProperty(obj,"age",{
      //     configurable:true,
      //     enumerable:true,
      //     get(){
      //         console.log("get");
      //         return 20;
      //     },
      //     set(newValue){
      //         console.log(newValue);
      //     }
      // })
      // console.log(obj);
      // obj.name = "111";
      let obj = { name: "张三", age: 20 };
      function observeObj(obj) {
        let keys = Object.keys(obj);
        keys.forEach((key) => {
          let val = obj[key]; //触发get
          Object.defineProperty(obj, key, {
            configurable: true,
            enumerable: true,
            get() {
              console.log("get");
              return val; // obj.name  --->get 操作
            },
            set(newValue) {
              console.log(newValue);
            },
          });
        });
      }

      observeObj(obj);
      // console.log(obj);
      obj.name;

      // var a  = 10
      // function test(){
      //     console.log(a);
      // }
      // test();

      // function test(){
      //     var a  =10;
      //     function fn(){
      //         console.log(a);
      //     }
      //     fn();
      // }
    </script>
  </body>
</html>
